<template>
    <div class="app-container">
        <div v-loading="tableLoading" class="listDiv">
            <el-form ref="form"  :model="form" label-width="130px">
                <el-row>
                    <h5 v-if="isType==2" class="titleInfo">对私账户</h5>
                    <div v-if="isType==2">
                        <el-col :span="12">
                            <el-form-item label="银行卡类型">
                                <span class="spanToInput">对私账户</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="操作人">
                                <span class="spanToInput">{{ detalisList.updatedBy | userinfo }}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="银行卡号">
                                <span class="spanToInput">{{ detalisList.cardNo }}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="公司打款银行卡号">
                                <span class="spanToInput">{{ detalisList.mmkCardNo }}</span>
                            </el-form-item>
                        </el-col>

                        <el-col :span="12">
                            <el-form-item label="开户行名称">
                                <span class="spanToInput">{{detalisList.bankTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="开户行名称">
                                <span class="spanToInput">{{detalisList.bankTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="持卡人">
                                <span class="spanToInput">{{detalisList.accountTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="身份证号">
                                <span class="spanToInput">{{detalisList.identity}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="手机号">
                                <span class="spanToInput">{{detalisList.phone}}</span>
                            </el-form-item>
                        </el-col>

                        <el-col :span="12">
                            <el-form-item label="提现状态">
                                <span class="spanToInput">{{detalisList.auditStatus | checkType}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="提现金额">
                                <span class="spanToInput">￥{{Number(detalisList.amount).toFixed(2)}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="提交审核日期">
                                <span class="spanToInput">{{detalisList.createdAt}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="审核通过日期">
                                <span class="spanToInput">{{detalisList.updatedAt}}</span>
                            </el-form-item>
                        </el-col>
                        <div v-if="isStatus == 2">
                            <el-col :span="12">
                                <el-form-item label="驳回理由" prop="remark">
                                    <el-input
                                        type="textarea"
                                        v-model="form.remark"
                                        :rows="4"
                                        disabled
                                    />
                                </el-form-item>
                            </el-col>
                        </div>
                    </div>
                    <div v-else>
                        <h5 v-if="isType==1" class="titleInfo">对公账户</h5>
                        <el-col :span="12">
                            <el-form-item label="银行卡类型">
                                <span class="spanToInput">对公账户</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="操作人">
                                <span class="spanToInput">{{detalisList.updatedBy | userinfo}}</span>
                            </el-form-item>
                        </el-col>

                        <el-col :span="12">
                            <el-form-item label="银行卡号">
                                <span class="spanToInput">{{detalisList.cardNo}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="公司打款银行卡号">
                                <span class="spanToInput">{{detalisList.mmkCardNo}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="开户行名称">
                                <span class="spanToInput">{{detalisList.bankTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="开户行名称">
                                <span class="spanToInput">{{detalisList.bankTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="开行支行">
                                <span class="spanToInput">{{detalisList.branchTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="企业账户名称">
                                <span class="spanToInput">{{detalisList.accountTitle}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="法人名称">
                                <span class="spanToInput">{{detalisList.enpUser}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="社会信用代码">
                                <span class="spanToInput">{{detalisList.identity}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="提现状态">
                                <span class="spanToInput">{{detalisList.auditStatus | checkType}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="提现金额" prop="amount">
                                <span class="spanToInput">￥{{Number(detalisList.amount).toFixed(2)}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="提交审核日期">
                                <span class="spanToInput">{{detalisList.createdAt}}</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="审核通过日期">
                                <span class="spanToInput">{{detalisList.updatedAt}}</span>
                            </el-form-item>
                        </el-col>
                        <div v-if="isStatus == 2">
                            <el-col :span="12">
                                <el-form-item label="驳回理由" prop="remark">
                                    <el-input
                                        type="textarea"
                                        v-model="form.remark"
                                        :rows="4"
                                        disabled
                                    />
                                </el-form-item>
                            </el-col>
                        </div>
                    </div>
                </el-row>
            </el-form>
        </div>
    </div>
</template>
<script>
import { withdrawalDetail } from "@/api/financShopCash";
import filter from "@/assets/filter.js";
export default {
    data() {
        return {
            isType: "",
            isStatus: "",
            detalisList: {},
            form: {
                remark: "",
                amount: ""
            },
            tableLoading: true
        };
    },
    filters: {
        // 提现状态
        checkType(e) {
            switch (e) {
                case 0:
                    return "审核中";
                    break;
                case 1:
                    return "审核通过";
                    break;
                case 2:
                    return "驳回";
                    break;

                default:
                    // return "暂无";
                    break;
            }
        }
    },
    created() {
        let recordId = this.$route.query.id;
        this.isType = this.$route.query.types;
        this.isStatus = this.$route.query.status;
        this.getDetails({ id: Number(recordId) });
    },
    methods: {
        // 详情列表
        getDetails(e) {
            withdrawalDetail(e)
                .then(res => {
                    if (!res.data.code) {
                        this.detalisList = res.data.data;
                        this.form.remark = this.detalisList.remark;
                        // this.form.amount = this.detalisList.amount.toFixed(2);
                    } else {
                        this.$message({
                            showClose: true,
                            message: res.data.msg,
                            type: "error"
                        });
                    }
                    this.tableLoading = false;
                })
                .catch(err => {
                    this.errorStatus(err);
                    this.tableLoading = false;
                });
        },
        // 弹窗组件
        eleMsg(txt, status) {
            this.$message({
                showClose: true,
                message: txt,
                type: status
            });
        },
        // 成功状态弹窗
        succStatus(txt, status) {
            this.eleMsg(txt, "success");
        },
        // 失败状态弹窗
        errorStatus(txt) {
            this.eleMsg(txt, "error");
        }
    }
};
</script>
<style scoped>
.app-container {
    padding: 0.1px !important;
}
.el-textarea__inner {
    display: block;
    width: 300px !important;
    min-height: 50px !important;
    box-sizing: border-box;
}
</style>
